import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import ElementPlus from "element-plus";
import "element-plus/dist/index.css";
import axios from "axios";
// @ts-ignore
import VMdEditor from "@kangc/v-md-editor";
import "@kangc/v-md-editor/lib/style/base-editor.css";
// @ts-ignore
import VMdPreview from "@kangc/v-md-editor/lib/preview";
import "@kangc/v-md-editor/lib/style/preview.css";
// @ts-ignore
import githubTheme from "@kangc/v-md-editor/lib/theme/github.js";
import "@kangc/v-md-editor/lib/theme/style/github.css";

// highlightjs
import hljs from "highlight.js";

/* import the fontawesome core */
import { library } from "@fortawesome/fontawesome-svg-core";

/* import font awesome icon component */
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";

/* import specific icons */
import { faUserSecret } from "@fortawesome/free-solid-svg-icons";

library.add(faUserSecret);

import * as ElementPlusIconsVue from "@element-plus/icons-vue";

import "element-plus/dist/index.css";

import MainHeader from "./components/common/MainHeader.vue";

VMdEditor.use(githubTheme, {
  Hljs: hljs,
});

VMdPreview.use(githubTheme, {
  Hljs: hljs,
});

const app = createApp(App);
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component);
}
app
  .use(store)
  .use(router)
  .use(ElementPlus)
  .use(VMdEditor)
  .use(VMdPreview)
  .component("font-awesome-icon", FontAwesomeIcon)
  .mount("#app");
app.component("MainHeader", MainHeader);
app.config.globalProperties.$axios = axios;
app.config.globalProperties.$target = "http://localhost:8080";
app.config.globalProperties.$config = {
  headers: {
    "Content-Type": "application/json;charset=utf-8",
  },
};

app.config.globalProperties.notify = function (
  title: string,
  msg: string,
  type: string
) {
  this.$notify({
    title: title,
    message: msg,
    type: type,
    offset: 100,
  });
};
app.config.globalProperties.notifySucceed = function (msg: string) {
  this.notify("成功", msg, "success");
};
app.config.globalProperties.notifyError = function (msg: string) {
  this.notify("错误", msg, "error");
};
